<template>
	<view class="pageBg" style="min-height: 100%;">
		<Skeleton v-if="skeletonLoading" type="list"></Skeleton>
		<Head type="list" title="名企直聘" :isBack="false">
			<ListFilters ref="refListFilters" :params="params" otherFilterType="companyListType"
				@doSearchByDistrict="doSearchByDistrict" @doSearchByTrade="doSearchByTrade"
				@doSearchByOther="doSearchByOther">
				<view class="tabBtns">
					<view class="btn ac">综合</view>
				</view>
			</ListFilters>
		</Head>
		<view class="companyList">
			<CompanyItem v-for="(item,index) in dataset" :key="item.id" :item="item" @toDetail="toDetail"></CompanyItem>
			<u-loadmore v-if="dataset.length >= pagesize" class="u-loadmore" :status="finished_status"></u-loadmore>
			<Empty v-if="show_empty"></Empty>
		</view>
	</view>
</template>

<script>
	import http from '@/utils/http'
	import api from '@/api'
	import CompanyItem from '@/components/listItem/companyItem.vue'
	import ListFilters from '@/components/ListFilters.vue'
	import Skeleton from '@/components/Skeleton.vue'
	export default {
		data() {
			return {
				skeletonLoading: true,
				params: {
					district1: '',
					district2: '',
					district3: '',
					districtName: '地区',
					trade: '',
					tradeName: '行业',
					scale: '',
					nature: '',
					famous: 1,
					otherNum: 0
				},
				page: 1,
				pagesize: 15,
				dataset: [],
				finished_status: 'loadmore',
				selectComArrOnload: [],
				show_empty: false
			};
		},
		components: {
			CompanyItem,
			ListFilters,
			Skeleton
		},
		onLoad(options) {
			if (options && options.paramsCurrent) {
				this.params = JSON.parse(options.paramsCurrent)
				this.$refs.refListFilters.initShareData(this.params)
				this.fetchData(true)
			}
		},
		onShareAppMessage() {
			let url = '/commonViews/FamousList?paramsCurrent=' + JSON.stringify(this.params)
			return {
				path: '/commonViews/FamousList?paramsCurrent=' + JSON.stringify(this.params),
				title: '【名企招聘】最新名企列表 - ' + this.$store.state.config.sitename,
				desc: ''
			}
		},
		onShareTimeline() {
			// info.imgUrl = this.info.thumb
			return {
				path: '/commonViews/FamousList?paramsCurrent=' + JSON.stringify(this.params),
				title: '【名企招聘】最新名企列表 - ' + this.$store.state.config.sitename,
			}
		},
		mounted() {
			this.fetchData(true)
		},
		onReachBottom() {
			this.finished_status = 'loading';
			this.page++
			this.fetchData(false)
		},
		onPageScroll(res) {
			uni.$emit('onPageScroll', res.scrollTop)
		},
		methods: {
			toDetail(id) {
				this.dataset.forEach(item => {
					if (item.id == id) {
						item.clicked = true
					}
				})
				let selectComArr = this.selectComArrOnload == undefined ? [] : this.selectComArrOnload
				if (selectComArr.indexOf(id) == -1 || selectComArr.length == 0) {
					selectComArr.push(id)
				}
				let selectComArrStr = JSON.stringify(selectComArr)
				uni.setStorageSync('selectComArr', selectComArrStr)
				uni.navigateTo({
					url: '/commonViews/CompanyShow?id=' + id
				})
			},
			fetchData(init) {
				this.show_empty = false
				let conditions = {
					...this.params
				}
				if (init === true) {
					this.page = 1
					this.finished_status = 'loading'
				}
				conditions.page = this.page
				conditions.pagesize = this.pagesize
				http
					.get(api.companylist, conditions)
					.then(res => {
						if (init === true) {
							this.dataset = [...res.data.data.items]
						} else {
							this.dataset = this.dataset.concat(res.data.data.items)
						}
						this.dataset.forEach(item => {
							item.clicked = false
						})
						this.getColorChange(); //缓存数据标题是否变色
						this.skeletonLoading = false
						this.finished_status = 'loadmore';
						// 数据全部加载完成
						if (res.data.data.items.length <= this.pagesize) {
							this.finished_status = 'nomore'
							if (init === false) {
								this.finished_status = 'nomore'
							} else if (res.data.data.items.length == 0) {
								this.show_empty = true
								this.finished_status = 'nomore'
							}
						}
					})
					.catch(() => {})
			},
			// 地区搜索
			doSearchByDistrict(data) {
				this.params.districtName = data.districtName
				this.doSearch({
					district1: data.district1,
					district2: data.district2,
					district3: data.district3
				})
			},
			// 行业搜索
			doSearchByTrade(data) {
				this.params.tradeName = data.label
				this.doSearch({
					trade: data.value
				})
			},
			// 其他搜索
			doSearchByOther(data) {
				this.doSearch(data)
			},
			// 通用搜索
			doSearch(data) {
				for (const key in data) {
					if (this.params.hasOwnProperty(key)) {
						this.params[key] = data[key]
					}
				}
				this.params.otherNum = data.otherNum
				if (this.params.otherNum == 0) {
					this.params.scale = ''
					this.params.nature = ''
				}
				this.page = 1
				this.fetchData(true)
			},
			getColorChange() {
				let LoginOrNotLocal = uni.getStorageSync('LoginOrNot');
				let LoginOrNot = this.$store.state.LoginOrNot.toString();
				uni.setStorageSync('LoginOrNot', LoginOrNot); //更新缓存中登录状态
				if (LoginOrNot != LoginOrNotLocal) { //登录状态改变时清空缓存数据
					uni.setStorageSync('selectArr', null); //职位
					uni.setStorageSync('selectResumeArr', null); //简历
					uni.setStorageSync('selectComArr', null); //企业
				}
				this.selectComArrOnload = uni.getStorageSync('selectComArr') == null || uni.getStorageSync(
					'selectComArr') == '' || uni.getStorageSync(
					'selectComArr') == undefined ? [] : JSON.parse(uni.getStorageSync('selectComArr'))
				this.selectComArrOnload.forEach(items => {
					this.dataset.forEach(item => {
						if (item.id == items) {
							item.clicked = true
						}
					})
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.companyList {
		padding: 0 30rpx 1rpx;
	}
</style>